<template>
  <div>
    <Form ref="form" :model="table">
      <FormItem label="选择连接">
        <Select v-model="table.linkId" @on-change="check">
          <Option v-for="item in links" :value="item.id" :key="item.id">{{item.name}}</Option>
        </Select>
      </FormItem>
      <FormItem label="实体状态" v-if="msg.msg">
        <Tag :color="msg.result?'success':'warning'">{{msg.msg}}</Tag>        
      </FormItem>
      <Table v-if="msg.data" :columns="columns" border :data="list">
          <template slot="status" slot-scope="{row,index}">
              <Tag v-if="row.status==0" color="warning">更新</Tag>
              <Tag v-if="row.status==1" color="success">添加</Tag>
              <Tag  v-if="row.status==-1" color="error">删除</Tag>
          </template>
      </Table>
      <FormItem v-if="msg.result">
        <Button type="primary" @click="sync">同步表</Button>
      </FormItem>
    </Form>
  </div>
</template>

<script>
import Api from "./api";
export default {
  name: "",
  data() {
    return {
      table: {
        id: "",
        linkId: "",
      },
      rules: [],
      list: [],
      links: [],
      columns: [
        {
          key: "status",
          title: "名称",
          align: "left",
           width: 90,
           slot:"status"
        },
        {
          key: "dbColumnName",
          title: "字段",
          align: "left",
          easy: true,
          hide: true,
          width: 200,
        },
        {
          key: "columnDescription",
          title: "名称",
          align: "left"
        },        
        {
          key: "dataType",
          title: "数据类型",
          align: "left",
          hide: true,
          width: 150,
        },
        {
          key: "length",
          title: "长度",
          align: "left",
          hide: true,
          width: 100,
        },
        {
          key: "decimalDigits",
          title: "小数位数",
          align: "left",
          width: 100,
          hide: true,
        },
        {
          key: "defaultValue",
          title: "默认值",
          align: "left",
          width: 100,
        },
        {
          key: "isNullable",
          title: "可空",
          align: "center",
          width: 70,
          render:(h,params)=>{
            return h('span',params.row.isNullable?"√":"")
          }
        },
      ],
      msg: {},
    };
  },
  props: {
    eid: {
      type: String,
      default: "",
    },
  },
  created() {
    this.init();
  },
  methods: {
    init() {
      this.table.id = this.eid;
      Api.links().then((r) => {
        this.links = r.result;
      });
    },
    check() {
      Api.check(this.table).then((r) => {
        if (r.success) {
          this.msg = r.result;
          this.$set(this.msg,r.result);
          let list = [];
          if (r.result.data) {
              var data=r.result.data;
            data.adds.map((u) => {
              u.status = 1;
              list.push(u);
            });
            data.changes.map((u) => {
              u.status = 0;
              list.push(u);
            });
           data.deletes.map((u) => {
              u.status = -1;
              list.push(u);
            });
            this.list = list;
            console.warn("list",this.list,r)
          } 
        }else {
            this.$Message.info(r.result.msg);
            this.msg = {};
            this.list = [];
          }
      });
    },
    sync() {
        if(this.msg.data){
            Api.updateTable(this.table).then(r=>{
                if(r.success){
                    this.$Message.info(r.result)
                }
            })
        }else{
            Api.createTable(this.table).then(r=>{
                if(r.success){
                    this.$Message.info(r.result)
                }
            })
        }
    },
  },
};
</script>

<style lang="less">
</style>